<div class="uc_title m_10">
	<label class="current"><span>我的订单</span></label>
</div>
<div class="box m_10">
	<table class="list_table" width="100%" cellpadding="0" cellspacing="0">
		<col width="250px" />
		<col width="140px" />
		<thead>
			<tr>
				<th>订单编号</th>
				<th>下单日期</th>
				<th>收货人</th>
				<th>支付方式</th>
				<th>总金额</th>
				<th>订单状态</th>
			</tr>
		</thead>
		<tbody id="orderData">
		</tbody>
		<tfoot>
			<tr>
				<td colspan="6" class="t_l">
					<div class='pages_bar' id='pages_bar'>

					</div>
				</td>
			</tr>
		</tfoot>
	</table>
</div>
<script>
	$(function () {

		$.ajax({
			type: "get",
			url: "/order",
			data: "opr=list&p=1",
			dataType: "json",
			beforeSend: function (r) {
				//加载层-默认风格
				layer.load();
			},
			success: function (result, status, xhr) {
				console.log(result);
				let s = template("orderTpl", { data: result.data });
				// console.log(s);
				$("#orderData").append(s);
				console.log(result.totalPages);
				let plist = new Array();
				for (let i = 1; i <= result.totalPages; i++) {
					plist[i] = i;
				}
				plist["currPage"] = result.currPage;
				plist["totalPages"] = result.totalPages;
				console.log(plist)
				let p = template("pagesTpl", { data: plist });
				$("#orderData").append(p);
			},
			complete: function (XMLHttpRequest, textStatus) {
				// alert('远程调用成功，状态文本值：'+textStatus);
				layer.closeAll('loading');
			},
			error: function () {
				layer.msg('系统繁忙，请稍后再试', { icon: 2 });
			}
		})
	})
</script>

<script id="orderTpl" type="text/html">
       {{each data as order}}
		<tr >
		<td><a href="javascript:void(0)" class="menu" onclick="details({{order.id}})">{{order.ordersId}}</a> </td>
		<td>{{order.times}}</td>
		<td>{{order.conSingnee}}</td>
		<td>
			{{if order.payMethod==1}} 支付宝 {{/if}}
			{{if order.payMethod==2}} 微信 {{/if}}
			{{if order.payMethod==3}} 货到付款 {{/if}}
			</td>
		<td>{{order.totalMoney}}<b style="color: rgb(226, 103, 46);">￥</b></td>
		<td>
			{{if order.state==1}} <b style="color: red;">待付款</b> {{/if}}
			{{if order.state==2}} 待发货 {{/if}}
			{{if order.state==3}} 已发货 {{/if}}
			{{if order.state==4}} 已完成 {{/if}}
			{{if order.state==5}} 退货中 {{/if}}
			{{if order.state==6}} 同意退货 {{/if}}
			{{if order.state==7}} 不同意退货 {{/if}}
			{{if order.state==8}} 退货成功 {{/if}}
			</td>
	</tr>
        {{/each}}
</script>

<script id="pagesTpl" type="text/html">
	<a href='javascript:void(0)' id="firstPage" onclick="goPage(1)">首页</a>
	 {{each data as p}}
		<a  href='javascript:void(0)' style="margin-left: 5px;" {{if p==data.currPage}} class="current_page" {{/if}} onclick="goPage({{p}})">{{p}}</a>
     {{/each}}
	<a href='javascript:void(0)' id="lastPage" style="margin-left: 5px;" onclick="goPage({{data.totalPages}})">尾页</a>
   <span style="margin-left: 10px;">当前第{{data.currPage}}页/共{{data.totalPages}}页</span>
</script>
<script>
	function goPage(p) {
		console.log(p);
		$.ajax({
			type: "get",
			url: "/order",
			data: "opr=list&p=" + p,
			dataType: "json",
			beforeSend: function (r) {
				//加载层-默认风格
				layer.load();
			},
			success: function (result, status, xhr) {
				$("#orderData").empty();
				console.log(result);
				let s = template("orderTpl", { data: result.data });
				$("#orderData").append(s);
				console.log(result.totalPages);
				let plist = new Array();
				for (let i = 1; i <= result.totalPages; i++) {
					plist[i] = i;
				}
				plist["currPage"] = result.currPage;
				plist["totalPages"] = result.totalPages;
				console.log(plist)
				let p = template("pagesTpl", { data: plist });
				$("#orderData").append(p);

			},
			complete: function (XMLHttpRequest, textStatus) {
				// alert('远程调用成功，状态文本值：'+textStatus);
				layer.closeAll('loading');
			},
			error: function () {
				layer.msg('系统繁忙，请稍后再试', { icon: 2 });
			}
		})
	}
</script>
